<template>
  <div class="Like">
    <van-nav-bar title="我的收藏" left-text="返回" left-arrow @click-left="onClickLeft" />
    <BgBox>
      <div class="product-box clearfix" v-if=" likeProduct.length>0">
        <div class="like-item fl" v-for="(item,index) in likeProduct" :key="index">
          <ProItem :item="item" :isRemove="true" @Remove="removeLike(item.pid,index)">

          </ProItem>
        </div>
      </div>
      <div v-else>
        <van-empty description="没有收藏商品" />
      </div>
    </BgBox>

  </div>

</template>

<script>
import BgBox from '@/components/bgbox.vue'
import ProItem from '@/components/pro-item.vue'
import request from '@/utils/reques'
import '@/assets/less/like.less'
import qs from 'qs'
export default {
  name: 'Like',
  components: {
    BgBox,
    ProItem
  },
  created() {
    this.getLikeProduct()
  },
  data() {
    return {
      likeProduct: []
    }
  },
  methods: {
    async removeLike(pid, index) {
      try {
        let tokenString = localStorage.getItem('token')

        if (!tokenString) {
          this.$toast('请先登录')
          return this.$router.push({ name: 'Login' })
        }
        this.$toast.loading({
          message: '获取信息中',
          forbidClick: true,
          duration: 0
        })
        const { data: res } = await request.post('/notlike', qs.stringify({ appkey: this.appkey, pid, tokenString }))
        if (res.code == 700) {
          this.$router.push({ name: 'Login' })
        } else if (res.code == 900) {
          this.$toast('删除成功')
          this.likeProduct.splice(index, 1)
        } else {
          this.$toast('删除失败')
        }
      } catch (error) {
        this.$toast.clear()
      }
    },
    onClickLeft() {
      this.$router.go(-1)
    },
    async getLikeProduct() {
      try {
        let tokenString = localStorage.getItem('token')
        if (!tokenString) {
          this.$toast('请先登录')
          return this.$router.push({ name: 'Login' })
        }
        this.$toast.loading({
          message: '获取信息中',
          forbidClick: true,
          duration: 0
        })
        const { data: res } = await request.get('/findAllLike', { params: { appkey: this.appkey, tokenString } })
        if (res.code == 700) {
          this.$router.push({ name: 'Login' })
        } else if (res.code == 2000) {
          this.likeProduct = res.result
        }
        this.$toast.clear()
      } catch (error) {
        this.$toast.clear()
      }
    }
  }
}
</script>

<style lang="less" scoped>
.bg-content {
  padding: 0px;
}
</style>